<template>
  <avue-form :option="option"
             v-model="form"
             :upload-before="uploadBefore"
             :upload-after="uploadAfter"></avue-form>
</template>
<script>
export default {
  data () {
    return {
      form: {
        imgUrl: ['/images/logo-bg.jpg'],
      },
      option: {
        column: [
          {
            label: '附件上传',
            prop: 'imgUrl',
            type: 'upload',
            listType: 'picture-card',
            span: 24,
            propsHttp: {
              res: 'data'
            },
            action: 'https://api.avuejs.com/imgupload'
          }
        ]
      }
    }
  },
  methods: {
    uploadBefore (file, done, loading, column) {
      console.log(file, column)
      //如果你想修改file文件,由于上传的file是只读文件，必须复制新的file才可以修改名字，完后赋值到done函数里,如果不修改的话直接写done()即可
      var newFile = new File([file], '1234', { type: file.type });
      done(newFile)
      this.$message.success('上传前的方法')
    },
    uploadAfter (res, done, loading, column) {
      console.log(res, column)
      done()
      this.$message.success('上传后的方法')
    }
  }
}
</script>